<!DOCTYPE html>
<html>
<head>
    <title>日新网 - 项目</title>
    <meta name="keywords" content="{$seo_keywords}"/>
    <meta name="description" content="{$seo_description}">
    <meta name="referrer" content="origin">
    <tc_include file="Public:head"/>
    <link href="/themes/simplebootx/Public/assets/css/reset.css" rel="stylesheet"/>
    <link href="/themes/simplebootx/Public/assets/css/sl_style.css?v={$SOURCE_VERSION}" rel="stylesheet"/>
    <script type="text/javascript" src="__PUBLIC__/js/rem.js"></script>
    <style>
        .tab_nav {
            height: .6rem;
        }
        .tab_nav ul {
            background-color: #333333;
        }
        .tab_nav li {
            width: 33%;
            color: #c5c5c5;
        }
        .tab_nav .active {
            color: #ffffff;
        }
        .project_introduce {
            padding-top: .2rem;
        }
        @media screen and (max-width:751px ){
            .navbar {
                display: none;
            }
            .project_top_logo {
                margin-top: -20px!important;
            }
            #tab_nav li {
                font-size: .28rem;

            }
            .project_details .project_introduce {
                font-size: .26rem;
            }
        }
        @media screen and (min-width: 751px) {
            .project_details {
                width: 1200px!important;
                margin: 0 auto;
            }
            .project_top_logo {
                margin-top: 40px;
            }
            .project_top_logo {
                height: 240px;
                width: 100%;
                box-sizing: border-box;
                /*overflow: hidden;*/
            }
            .project_top_logo .logo_img{
                padding: .22rem .24rem;

            }
            .project_top_logo .logo_img img {
                display: block;
                width: 100%;
                height: 100%;
            }

            .project_top_logo .logo_text {
                width:820px!important;
                padding-top: .5rem;
            }
            .project_top_logo .logo_text h4 {
                font-size: 42px!important;
                color: #333333;
            }
            .project_top_logo .logo_text span {
                font-size: 28px!important;
                color: #a9a9a9;
                display: block;
                margin: .2rem 0;
                padding: 1px;
            }
            .project_top_logo .logo_text p {
                font-size: 20px!important;
                color: #a9a9a9;
                max-height: 120px;
                overflow: hidden;
            }
            .project_details .project_introduce {
                font-size: .14rem;
            }
        }
    </style>
</head>
<body>
<tc_include file="Public:nav"/>

    <div class="project_details comWidth">

        <style>
            .project_top_logo {
                height: 2.4rem;
                width: 100%;
                box-sizing: border-box;
                /*overflow: hidden;*/
            }
            .project_top_logo .logo_img{
                padding: .22rem .24rem;

            }
            .project_top_logo .logo_img img {
                display: block;
                width: 100%;
                height: 100%;
            }
            .project_top_logo .logo_text {
                width:4.6rem;
                padding-top: .5rem;
            }
            .project_top_logo .logo_text h4 {
                font-size: .42rem;
                color: #333333;
            }
            .project_top_logo .logo_text span {
                font-size: .28rem;
                color: #a9a9a9;
                display: block;
                margin: .2rem 0;
                padding: 1px;
            }
            .project_top_logo .logo_text p {
                font-size: .18rem;
                color: #a9a9a9;
            }
            #tab_nav li {
                float: left;
                width: 33.3%;
                height: .6rem;
                color: #c5c5c5;
                font-size: .22rem;
                line-height: .6rem;
                text-align: center;
            }
            #tab_nav .active {
                color: #FFFFFF;
            }
        </style>
        <div class="project_top_logo clearfix">
            <div class="pull-left logo_img" style="width: 2rem;height: 2rem;">
                <!--<img src="/public/images/img/payment.png" alt="">-->
                <img src="{$info.imgs}" alt="">
            </div>
            <div class="pull-left logo_text">
                <h4>{$info.name}</h4>
                <volist name="category_names" id="vo">
                <span>{$vo}</span>
                </volist>
                <!--<p>-->
                    <!--项目简介我是个人简介我是。个人简介我是个人简介我是个人简介我是个人简介我是个-->
                <!--</p>-->
            </div>
        </div>
        <div class="tab_nav clearfix" id="tab_nav" style="clear: both;">
            <ul class="comWidth clearfix maodian">
                <a href="#tab1"><li class="active">基本信息</li></a>
                <a href="#tab2"><li >周边配套</li></a>
                <a href="#tab3"><li>小区规划</li></a>
            </ul>
        </div>
        <div id="tab_content">
            <div class="project_introduce" id="tab1">
                <!--<h4>项目简介</h4>-->
                <!--<p class="textarea">项目简介</p>-->
                <table class="table clearfix">
                    <tr>
                        <th>价格</th>
                        <td>{$info.price}</td>
                    </tr>
                    <tr>
                        <th>建筑类别</th>
                        <td>{$info.build_type}</td>
                    </tr>
                    <tr>
                        <th>物业类别</th>
                        <td>{$info.property_type}</td>
                    </tr>
                    <tr>
                        <th>产权年限</th>
                        <td>{$info.property_right}</td>
                    </tr>
                    <tr>
                        <th>开发商</th>
                        <td>{$info.developer}</td>
                    </tr>
                    <tr>
                        <th>楼盘地址</th>
                        <td>{$info.addr}</td>
                    </tr>
                </table>
            </div>
            <div class="project_introduce " id="tab2">
                <h4>周边配套</h4>
                <table class="table clearfix">
                    <volist name="info.other_info" id="vo_o">
                        <tr>
                            <th>{$key}</th>
                            <td>{$vo_o}</td>
                        </tr>
                    </volist>
                </table>
            </div>
            <div class="project_introduce" id="tab3" >
                <h4>小区规划</h4>
                <table class="table clearfix">
                    <tr>
                        <th>占地面积</th>
                        <td>{$info.floor_space}</td>
                    </tr>
                    <tr>
                        <th>容积率</th>
                        <td>{$info.plot_ratio}</td>
                    </tr>
                    <tr>
                        <th>停车位</th>
                        <td>{$info.parking_space}</td>
                    </tr>
                    <tr>
                        <th>总户数</th>
                        <td>{$info.house_count}</td>
                    </tr>
                    <tr>
                        <th>物业费</th>
                        <td>{$info.proprety_fee}</td>
                    </tr>
                </table>
            </div>
        </div>
    </div>
<!-- JavaScript -->
<tc_include file="Public:scripts"/>
<script>
    $(".maodian li").click(function () {
        $(this).addClass("active").parent('a').siblings().find('li').removeClass('active');
    })
</script>
</body>
</html>